/**
 * 门店和房间选择器UI组件
 * 
 * 用途：提供门店和房间选择的用户界面
 * 方法：使用Jetpack Compose构建下拉选择器和状态管理
 * 原理：通过Dropdown菜单展示门店和房间列表，支持级联选择
 */
package com.example.brain_wave.ui.components

import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDropDown
import androidx.compose.material.icons.filled.Store
import androidx.compose.material.icons.filled.Room
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Shadow
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import com.example.brain_wave.ui.components.Store
import com.example.brain_wave.ui.components.Room
import com.example.brain_wave.ui.theme.*

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun StoreRoomSelector(
    stores: List<Store>,
    rooms: List<Room>,
    selectedStore: Store?,
    selectedRoom: Room?,
    onStoreSelected: (Store) -> Unit,
    onRoomSelected: (Room) -> Unit,
    isLoading: Boolean = false,
    modifier: Modifier = Modifier
) {
    Card(
        modifier = modifier
            .fillMaxWidth()
            .shadow(
                elevation = 8.dp,
                shape = RoundedCornerShape(12.dp),
                ambientColor = TechGlow,
                spotColor = TechBlue
            ),
        colors = CardDefaults.cardColors(
            containerColor = TechSurface
        ),
        shape = RoundedCornerShape(12.dp),
        border = BorderStroke(1.dp, TechBorder)
    ) {
        Column(
            modifier = Modifier.padding(16.dp),
            verticalArrangement = Arrangement.spacedBy(12.dp)
        ) {
            
            // 门店选择
            StoreDropdown(
                stores = stores,
                selectedStore = selectedStore,
                onStoreSelected = onStoreSelected,
                isLoading = isLoading
            )
            
            // 房间选择
            RoomDropdown(
                rooms = rooms,
                selectedRoom = selectedRoom,
                onRoomSelected = onRoomSelected,
                isEnabled = selectedStore != null && !isLoading
            )
        }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun StoreDropdown(
    stores: List<Store>,
    selectedStore: Store?,
    onStoreSelected: (Store) -> Unit,
    isLoading: Boolean
) {
    var expanded by remember { mutableStateOf(false) }
    
    Column {
        Text(
            text = "选择门店:",
            color = TechTextSecondary,
            style = MaterialTheme.typography.bodyMedium
        )
        
        ExposedDropdownMenuBox(
            expanded = expanded,
            onExpandedChange = { expanded = !expanded && !isLoading }
        ) {
            OutlinedTextField(
                value = selectedStore?.name ?: "请选择门店",
                onValueChange = { },
                readOnly = true,
                enabled = !isLoading,
                leadingIcon = {
                    Icon(
                        imageVector = Icons.Default.Store,
                        contentDescription = "门店",
                        tint = TechBlue
                    )
                },
                trailingIcon = {
                    if (isLoading) {
                        CircularProgressIndicator(
                            modifier = Modifier.size(20.dp),
                            color = TechBlue,
                            strokeWidth = 2.dp
                        )
                    } else {
                        ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded)
                    }
                },
                colors = OutlinedTextFieldDefaults.colors(
                    focusedBorderColor = TechBlue,
                    unfocusedBorderColor = TechBorder,
                    focusedTextColor = TechTextPrimary,
                    unfocusedTextColor = TechTextSecondary,
                    disabledTextColor = TechTextSecondary.copy(alpha = 0.6f),
                    disabledBorderColor = TechBorder.copy(alpha = 0.6f)
                ),
                modifier = Modifier
                    .menuAnchor()
                    .fillMaxWidth()
            )
            
            ExposedDropdownMenu(
                expanded = expanded,
                onDismissRequest = { expanded = false }
            ) {
                stores.forEach { store ->
                    DropdownMenuItem(
                        text = {
                            Text(
                                text = store.name,
                                color = TechTextPrimary
                            )
                        },
                        onClick = {
                            onStoreSelected(store)
                            expanded = false
                        },
                        leadingIcon = {
                            Icon(
                                imageVector = Icons.Default.Store,
                                contentDescription = null,
                                tint = TechBlue
                            )
                        }
                    )
                }
                
                if (stores.isEmpty() && !isLoading) {
                    DropdownMenuItem(
                        text = {
                            Text(
                                text = "暂无门店数据",
                                color = TechTextSecondary
                            )
                        },
                        onClick = { }
                    )
                }
            }
        }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun RoomDropdown(
    rooms: List<Room>,
    selectedRoom: Room?,
    onRoomSelected: (Room) -> Unit,
    isEnabled: Boolean
) {
    var expanded by remember { mutableStateOf(false) }
    
    Column {
        Text(
            text = "选择房间:",
            color = if (isEnabled) TechTextSecondary else TechTextSecondary.copy(alpha = 0.6f),
            style = MaterialTheme.typography.bodyMedium
        )
        
        ExposedDropdownMenuBox(
            expanded = expanded,
            onExpandedChange = { expanded = !expanded && isEnabled }
        ) {
            OutlinedTextField(
                value = if (isEnabled) (selectedRoom?.name ?: "请选择房间") else "请先选择门店",
                onValueChange = { },
                readOnly = true,
                enabled = isEnabled,
                leadingIcon = {
                    Icon(
                        imageVector = Icons.Default.Room,
                        contentDescription = "房间",
                        tint = if (isEnabled) TechBlue else TechBlue.copy(alpha = 0.6f)
                    )
                },
                trailingIcon = {
                    if (isEnabled) {
                        ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded)
                    }
                },
                colors = OutlinedTextFieldDefaults.colors(
                    focusedBorderColor = TechBlue,
                    unfocusedBorderColor = TechBorder,
                    focusedTextColor = TechTextPrimary,
                    unfocusedTextColor = TechTextSecondary,
                    disabledTextColor = TechTextSecondary.copy(alpha = 0.6f),
                    disabledBorderColor = TechBorder.copy(alpha = 0.6f)
                ),
                modifier = Modifier
                    .menuAnchor()
                    .fillMaxWidth()
            )
            
            if (isEnabled) {
                ExposedDropdownMenu(
                    expanded = expanded,
                    onDismissRequest = { expanded = false }
                ) {
                    rooms.forEach { room ->
                        DropdownMenuItem(
                            text = {
                                Text(
                                    text = room.name,
                                    color = TechTextPrimary
                                )
                            },
                            onClick = {
                                onRoomSelected(room)
                                expanded = false
                            },
                            leadingIcon = {
                                Icon(
                                    imageVector = Icons.Default.Room,
                                    contentDescription = null,
                                    tint = TechBlue
                                )
                            }
                        )
                    }
                    
                    if (rooms.isEmpty()) {
                        DropdownMenuItem(
                            text = {
                                Text(
                                    text = "该门店暂无房间",
                                    color = TechTextSecondary
                                )
                            },
                            onClick = { }
                        )
                    }
                }
            }
        }
    }
}

@Composable
fun StoreRoomInfo(
    selectedStore: Store?,
    selectedRoom: Room?,
    modifier: Modifier = Modifier
) {
    Card(
        modifier = modifier
            .fillMaxWidth()
            .shadow(
                elevation = 4.dp,
                shape = RoundedCornerShape(8.dp),
                ambientColor = TechGlow,
                spotColor = TechBlue
            ),
        colors = CardDefaults.cardColors(
            containerColor = TechSurface
        ),
        shape = RoundedCornerShape(8.dp),
        border = BorderStroke(1.dp, TechBorder)
    ) {
        Column(
            modifier = Modifier.padding(12.dp),
            verticalArrangement = Arrangement.spacedBy(8.dp)
        ) {
            Text(
                text = "当前选择",
                style = MaterialTheme.typography.titleSmall,
                color = TechTextPrimary,
                fontWeight = FontWeight.Bold
            )
            
            Row(
                modifier = Modifier.fillMaxWidth(),
                horizontalArrangement = Arrangement.spacedBy(16.dp)
            ) {
                // 门店信息
                Column(modifier = Modifier.weight(1f)) {
                    Text(
                        text = "门店:",
                        color = TechTextSecondary,
                        style = MaterialTheme.typography.bodySmall
                    )
                    Text(
                        text = selectedStore?.name ?: "未选择",
                        color = TechTextPrimary,
                        style = MaterialTheme.typography.bodyMedium,
                        fontWeight = FontWeight.Medium
                    )
                    if (selectedStore != null) {
                        Text(
                            text = "ID: ${selectedStore.id}",
                            color = TechTextSecondary,
                            style = MaterialTheme.typography.bodySmall
                        )
                    }
                }
                
                // 房间信息
                Column(modifier = Modifier.weight(1f)) {
                    Text(
                        text = "房间:",
                        color = TechTextSecondary,
                        style = MaterialTheme.typography.bodySmall
                    )
                    Text(
                        text = selectedRoom?.name ?: "未选择",
                        color = TechTextPrimary,
                        style = MaterialTheme.typography.bodyMedium,
                        fontWeight = FontWeight.Medium
                    )
                    if (selectedRoom != null) {
                        Text(
                            text = "ID: ${selectedRoom.id}",
                            color = TechTextSecondary,
                            style = MaterialTheme.typography.bodySmall
                        )
                    }
                }
            }
        }
    }
}